/** Copyright 2020 
  * @时间: 2020/10/5
  * @作者: 臧锡洋(Seale)
  * @blog: https://www.imsle.com
  * 复用css请注明作者
*/

.mid-container .container{
    margin: 0 195px;
}
.service-item{
    box-sizing: border-box;
    height: 300px;
}
.service-item > .title-container{
    position: relative;
    width: 87px;

    writing-mode: vertical-lr;
    -webkit-writing-mode: vertical-lr;
    letter-spacing: 10px;
    font-size: 30px;
    color:#fff;
    background: #c0a46b;
    padding: 70px 0;
    flex: none;
}
.service-item > .title-container>.arrow{
    position: absolute;
    background: url("../img/arrow_ypng.png") no-repeat;
    width: 28px;
    height: 37px;
    top: 132px;
}

.service-item > .image-container{
    flex: none;
    height: 300px;
}
.service-item> .content-container{
    padding: 68px 39px 147px 37px;
    line-height: 25px;
}

.service-item.right>.title-container>.arrow{
    left: -28px;
    transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
}
.service-item.left>.title-container>.arrow{
    right: -28px;
}

.service-item.right>.title-container{
    order: 3;
}
.service-item.right>.content-container{
    order: 2;
}
.service-item.right>.image-container{
    order: 1;
}

.service-item.left>.title-container{
    order: 1;
}
.service-item.left>.content-container{
    order: 2;
}
.service-item.left>.image-container{
    order: 3;
}